import "./detail.css";
export function Detail() {
  return (
    <>
      <div className="Container">
        <Header></Header>
        <Content></Content>
        <Footer></Footer>
      </div>
    </>
  );
}

function Header() {
  return (
    <>
      <div className="Header">
        <img src="/myleft.svg" alt="" />
        <div className="d1">
          <span>Time Machine</span>
          <span className="s1">Crooked Doors</span>
        </div>
      </div>
    </>
  );
}

function Content() {
  return (
    <>
      <div className="Content">
        <img className="i1" src="/myimg.png" alt="" />
        <div className="d1">
          <p></p>
        </div>
        <div className="d2">
          <span>00:43</span>
          <span>04:20</span>
        </div>
        <div className="d3">
          <img src="/kuaitui.svg" alt="" />
          <img src="/bofang.svg" alt="" />
          <img src="/kuaijin.svg" alt="" />
        </div>
      </div>
    </>
  );
}

function Footer() {
  return (
    <>
      <div className="Footer">
        <img src="/loopplay.svg" alt="" />
        <img src="/randomplay.svg" alt="" />
        <img src="/add.svg" alt="" />
        <img src="/like.svg" alt="" />
      </div>
    </>
  );
}
